<template>
  <div class="comments">
      <li><a @click="insert('suoyin')" href="javascript:;">👑<span>索引</span></a></li>
      <li><a @click="insert('date')" href="javascript:;">⏱️<span>时间</span></a></li>
      <li><a @click="insert('href')" href="javascript:;">🔗<span>链接</span></a></li>
      <li><a @click="insert('biaoqing')" href="javascript:;">🤡<span>表情</span></a></li>
      <li><a @click="insert('yinyong')" href="javascript:;">🔊<span>引用</span></a></li>
      <li><a @click="insert('table')"   href="javascript:;">🎏<span>列表</span></a></li>
      <li></li>
  </div>
</template>

<script>
export default {
    methods:{
        insert(tool){
            this.$emit('tool',tool);
        }
    }
}
</script>

<style lang="less" scopde>
  .comments{
    width: 100%;
    height: 30px;
    // background: red;s
    display:flex;
    justify-content: space-around;
    li{
        list-style: none;
        float: left;
        width:15%;
        line-height: 30px;
        span{
            font-size: 10px;
            // translate: 1s all;
        }
        span:hover{
        // position: absolute;
        font-size: 15px;
        // background: red;
    }
    }

  }
</style>